/**
 * Created by ljg on 2017/3/27.
 */
import './style.css';

const searchRegion=function () {
    angular.module('ui.table')
        .directive('searchRegion', function (ajaxHelper) {
            return {
                restrict: 'E',
                replace: true,
                transclude: true,
                controller:function ($scope,$attrs) {
                    const url=$attrs.url||"regioncode/list";
                    ajaxHelper.getJson(url,function (result) {
                        const dataList=result.data||[];
                        const regionData={};
                        const provinceData={};
                        const cityData={};
                        const areaData={};
                        for(var i in dataList){
                            const data=dataList[i]||{};
                            const dd={code:data.code,name:data.name,pcode:data.pcode,province:data.province,city:data.city,level:data.level};
                            regionData[data.code]=dd;
                            if(data.level=='1'){
                                provinceData[data.code]=dd;
                            }else if(data.level=='2'){
                                cityData[data.code]=dd;

                            }else if(data.level=='3'){
                                areaData[data.code]=dd;
                            }
                        }
                        for (var i in areaData){
                            const aData=areaData[i];
                            const pData=cityData[aData.pcode];
                            const children=pData.children||{};
                            children[aData.code]=aData;
                            pData.children=children;
                        }
                        for (var i in cityData){
                            const cData=cityData[i];
                            const pData=provinceData[cData.pcode];
                            const children=pData.children||{};
                            children[cData.code]=cData;
                            pData.children=children;
                        }
                        $scope.regionData=regionData;
                        $scope.$parent.regionData=regionData;
                        $scope.provinceData=provinceData;
                        $scope.cityData={};
                        $scope.areaData={};
                        // 默认值;
                        $scope.changeValue("",1);
                    })
                },
                scope:{},
                template: function(el,attr){
                    const pName=attr.pName;
                    const cName=attr.cName;
                    const aName=attr.aName;
                    return '<div class="'+attr.class+' region" >' +
                                '<div class={{"col-md-"+12/count}}><select  name='+pName+' class="form-control"><option value="">'+(attr.label?attr.label:"请选择省份")+'</option></select></div>'+
                                '</select>' +
                                (cName?  '<div class={{"col-md-"+12/count}}><select name='+cName+' class="form-control"><option value="">请选择市</option></select></div>':'')+
                                (aName?  '<div class={{"col-md-"+12/count}}><select name='+aName+' class="form-control"><option value="">请选择区县</option></select></div>':'')+
                            '</div>';
                },
                link : function(scope, element, attrs) {
                    const pName=attrs.pName;
                    const cName=attrs.cName;
                    const aName=attrs.aName;

                    let count=0 ;
                    pName&&count++;
                    cName&&count++;
                    aName&&count++;
                    scope.count=count;

                    const loopOption=function (datas,val) {
                        let str="";
                        for (let i in datas){
                            const selected=datas[i].code==val?'selected':'';
                            str+="<option value='"+datas[i].code+"' "+selected+" class='ng-scope'>"+datas[i].name+"</option>";
                        }
                        return str;
                    }
                    const changeValue=function (v,level) {
                        const value = v || scope.value;
                        const defaulyData = scope.regionData[value] || {};
                        let provinceData = scope.provinceData;
                        let cityData = {};
                        let areaData = {};
                        switch (defaulyData.level+"") {
                            case "1":
                                cityData = provinceData[value].children;
                                $(element).find("select[name="+pName+"]").html("<option value=''>"+(attrs.label?attrs.label:"请选择省份")+"</option>").append($(loopOption(provinceData,defaulyData.code)));
                                $(element).find("select[name="+cName+"]").html("<option value=''>请选择市</option>").append($(loopOption(cityData)));
                                $(element).find("select[name="+aName+"]").html("<option value=''>请选择区县</option>");
                                break;
                            case "2":
                                cityData = provinceData[defaulyData.province].children || {};
                                areaData = cityData[defaulyData.code].children || {};
                                $(element).find("select[name="+pName+"]").html("<option value=''>"+(attrs.label?attrs.label:"请选择省份")+"</option>").append($(loopOption(provinceData,defaulyData.province)));
                                $(element).find("select[name="+cName+"]").html("<option value=''>请选择市</option>").append($(loopOption(cityData,defaulyData.code)));
                                $(element).find("select[name="+aName+"]").html("<option value=''>请选择区县</option>").append($(loopOption(areaData)));
                                break;
                            case "3":
                                cityData = provinceData[defaulyData.province].children || {};
                                areaData = cityData[defaulyData.city].children || {};
                                $(element).find("select[name="+pName+"]").html("<option value=''>"+(attrs.label?attrs.label:"请选择省份")+"</option>").append($(loopOption(provinceData,defaulyData.province)));
                                $(element).find("select[name="+cName+"]").html("<option value=''>请选择市</option>").append($(loopOption(cityData,defaulyData.city)));
                                $(element).find("select[name="+aName+"]").html("<option value=''>请选择区县</option>").append($(loopOption(areaData,defaulyData.code)));
                                break;
                            default:
                                if(level){
                                    if(level==1){
                                        $(element).find("select[name="+pName+"]").html("<option value=''>"+(attrs.label?attrs.label:"请选择省份")+"</option>").append($(loopOption(provinceData,defaulyData.code)));
                                        $(element).find("select[name="+cName+"]").html("<option value=''>请选择市</option>").append($(loopOption([],defaulyData.city)));
                                        $(element).find("select[name="+aName+"]").html("<option value=''>请选择区县</option>").append($(loopOption([],defaulyData.code)));
                                    }else if(level==2){
                                        $(element).find("select[name="+aName+"]").html("<option value=''>请选择区县</option>").append($(loopOption([],defaulyData.code)));
                                    }
                                    break;
                                }
                                $(element).find("select[name="+pName+"]").html("<option value=''>"+(attrs.label?attrs.label:"请选择省份")+"</option>").append($(loopOption(provinceData)));
                                $(element).find("select[name="+cName+"]").html("<option value=''>请选择市</option>");
                                $(element).find("select[name="+aName+"]").html("<option value=''>请选择区县</option>");
                                break;
                        }
                    }
                    scope.changeValue=changeValue;
                    $(element).find("select[name="+pName+"]").bind("change",function (event) {
                        const value=this.value;
                        changeValue(value,1);

                    });
                    $(element).find("select[name="+cName+"]").bind("change",function (event) {
                        const value=this.value;
                        changeValue(value,2);

                    });
                    scope.$watch("value",function (newV,oldV) {
                        if(newV!=oldV){
                            changeValue(newV);
                        }
                    });


                },
            };
        });
}
export default searchRegion;
